<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>NBA赛事</title>
    <link rel="icon" type="image/x-icon" href="../images/nba-icon.png" />
    <link rel="stylesheet" href="../ft-carousel.css" />

    <link rel="stylesheet" href="../style.css" />
    <style>
      .example {
        position: relative;
        /* z-index: 1; */
        width: 100%;
        height: 500px;
        font-size: 40px;
        text-align: center;
        margin: 5px auto;
        background-color: #464576;
      }
      .carousel-item {
        line-height: 336px;
        color: #fff;
        /* font-family: Arial Black; */
      }
    </style>
  </head>
  <body>
    <!-- 头部导航栏部分 -->
    <div class="w dsj-header">
      <img src="../images/logo1.png" alt="" />
      <!-- 头部到导航栏 -->
      <div class="header-one">
        <span>精选</span>
        <img src="../images/0 (1).png" alt="" />
        <h4>电视剧</h4>
        <ul>
          <li><a href="#">电影</a></li>
          <li><a href="#">综艺</a></li>
          <li><a href="#">动漫</a></li>
          <li><a href="#">少儿</a></li>
          <li><a href="#">纪录片</a></li>
          <li><a href="#">VIP会员</a></li>
          <li><a href="#">全部</a></li>
        </ul>
      </div>
      <!-- 搜索框 -->
      <div class="header-two">
        <input type="text" placeholder="黄飞鸿之林世荣" />
        <button>🔍全网搜</button>
      </div>
      <!-- 用户登录按钮 -->
      <div class="go">
        <a href="#"><img src="../images/go.png" alt=""/></a>
      </div>
    </div>
    <!-- 主体导航栏部分 -->

    <div class="hd">
      <ul>
        <li>
          <a href="#">NBA精选</a>
          <a href="#">洛杉矶湖人</a>
          <a href="#">科比-布莱恩特</a>
          <a href="#">勒布朗-詹姆斯</a>
          <a href="#">金州勇士</a>
          <a href="#">史蒂芬-库里</a>
          <a href="#">常规赛</a>
          <a href="#">季后赛</a>
          <a href="#">十佳球</a>
          <a href="#">五佳球</a>
          <a href="#">绝杀</a>
          <a href="#">更多分类</a>
        </li>
      </ul>
    </div>
    <!-- 主体部分 -->
    <div class="example ">
      <div class="ft-carousel" id="carousel_1">
        <ul class="carousel-inner">
          <li class="carousel-item"><img src="../images/nba6.jpg" /></li>
          <li class="carousel-item"><img src="../images/nba2.jpg" /></li>
          <li class="carousel-item"><img src="../images/nba3.jpg" /></li>
          <li class="carousel-item"><img src="../images/nba4.jpg" /></li>
          <li class="carousel-item"><img src="../images/nba5.jpg" /></li>
          <li class="carousel-item">
            <img src="../images/nba3.jpg" />
          </li>
        </ul>
      </div>

      <div class="side-right">
        <div class="mask"></div>
        <ul>
          <li>
            <a href="#">凯尔特人121-113湖人</a>
            <a href="NBA-1.html">NBA五佳球</a>
            <a href="#">NBA十佳球</a>
            <a href="#">NBA长暂停</a>
            <a href="#">勇士119-101骑士</a>
            <a href="#">勇士119-101骑士</a>
            <a href="#">《音为有你》</a>
            <a href="#">《漫游NBA》</a>
          </li>
        </ul>
      </div>
    </div>
    <!-- 盒子部分开始 -->

    <!-- 盒子结束部分 -->
    <script src="../js/jquery.min.js"></script>
    <script src="../js/ft-carousel.min.js"></script>
    <script type="text/javascript">
      $("#carousel_1").FtCarousel();

      $("#carousel_2").FtCarousel({
        index: 1,
        auto: false
      });

      $("#carousel_3").FtCarousel({
        index: 0,
        auto: true,
        time: 3000,
        indicators: false,
        buttons: true
      });
    </script>
  </body>
</html>
